<template>
	<view>
		<view class="cq">

			<img src="https://www.leedong.top/img/suangua.gif" alt="">

		</view>
		<view class="start">
			<view class="input">
				<input type="text" placeholder="请输心中所想..." />
			</view>
			<text @click="start">开始</text>
		</view>
		<view class="xaingxi" v-if="list!=null">
			<view class="c">
				<view class="t">
					<text class="shu"></text>
					<text class="f">卦象</text>
				</view>
				<view class="m">
					<text>结果:</text>
					<text>{{list.g}}</text>
				</view>

				<view class="m">

					<text>{{list.time}}</text>
				</view>


			</view>
		</view>
			<view class="bottom">
				诸葛神算六十四卦384卦随机抽卦解签,仅供娱乐，切勿迷信
			</view>
	</view>
</template>

<script>
	import {
		throttle
	} from '../../utils/request.js'
	export default {
		data() {
			return {

				list: null
			}
		},
		onShareAppMessage(res) {
				wx.showShareMenu({
				     withShareTicket: true,
				     menus: ['shareAppMessage', 'shareTimeline']
				    })
				return{
						title:"来算一卦吧",
						imageUrl: 'https://www.leedong.top/img/suangua1.jpg'
					
						
				}
				
				},
				//2.分享到朋友圈
		onShareTimeline(){
		
			return {
				title: '来算一卦吧',
				imageUrl: 'https://www.leedong.top/img/suangua1.jpg'
			
				
			}
		},
		methods: {

			start(e) {
				this.show = false;
				this.hide = true;
				throttle(this.getData(), 2000)
			},
			confirm(e) {
				console.log(e);
			},
			getData() {
				uni.showLoading({
					title: '加载中'
				})
				this.$api.zgsg().then(res => {
					if (res.code == 200) {
						this.list = res;
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'noe'
						})
					}
					uni.hideLoading()




				})
			}
		}
	}
</script>

<style lang="scss">
	.cq {
		text-align: center;

		img {
			width: 176px;
			height: 296px;
			aspect-ratio: 1;
			object-fit: cover;
			object-position: center;
		}
	}

	.start {
		width: 100%;
		text-align: center;

		text {
			width: 120px;
			display: inline-block;
			background-color: #e32616;
			font-size: 30rpx;
			color: #fff;
			padding: 10px;
			border-radius: $uni-border-radius-base;
			line-height: 15px;
			margin-top: 20px;
		}

	}

	.xaingxi {
		padding: 20px;

		.c {
			margin-top: 10px;

			.t {
				font-size: 30rpx;
				width: 100%;
				border-bottom: 1px solid #f5f5f5;
				padding: 10px;

				display: flex;

				.f {
					padding: 0 10rpx;
				}

				.shu {
					width: 4px;
					height: 24px;

					background-color: #9d9e97;
				}
			}

			.m {
				font-size: 28rpx;
				margin-top: 20rpx;
				text{
					user-select: all;
				}
			}

			.qg {
				margin-top: 10px;

			}
		}
	}
</style>